var cssbtn = document.querySelector(".addbox .add");
cssbtn.onclick = () => {
  mask.style.display = "block";
}
var mask = document.querySelector(".mask");
mask.onclick = (e) => {
  mask.style.display = "none";
  inputs[0].value = '';
  inputs[1].value = '';
  inputs[2].value = '';
}
var content = document.querySelector(".content");
content.onclick = (e) => {
  e = e || window.event;
  e.stopPropagation();
}

function render(userlist) {
  var str = userlist.map((item, index) => {
    return `<ul class="row">
            <li>${item.email}</li> 
            <li>${item.name}</li>
            <li>${item.phone}</li>
            <li>编辑2</li>
            <li>是</li>
            <li>正常</li>
            <li><span class="iconfont icon-bianji editicon" id="${item._id}" email="${item.email}" name="${item.name}" phone="${item.phone}"></span><span class="iconfont icon-shanchu deleteicon" id="${item._id}"></span></li>
            </ul>`
  }).join("")
  if (userlist.length > 0) {
    document.querySelector(".table-body").innerHTML = str;
  } else {
    document.querySelector(".table-body").innerHTML = "<div class='empty'>无用户数据!</div>";
  }
}
var pages = 1
// var max = 0
axios.get('/user/list', {
  params: {
    page: pages,
    count: 2
  }
}).then((res) => {
  console.log(res.data);
})
var next = document.querySelector('.next')
next.onclick = () => {
  axios.get('/user/list', {
    params: {
      page: ++pages,
      count: 2
    }
  }).then((res) => {
    render(res.data.data)
  })
}
var prev = document.querySelector('.prev')
prev.onclick = () => {
  axios.get('/user/list', {
    params: {
      page: --pages,
      count: 2
    }
  }).then((res) => {
    render(res.data.data)
  })
}
var search = document.querySelector('.search')
var inputs = document.querySelector('.searchbox input')
search.onclick = () => {
  axios.get('/user/search', {
    params: {
      searchkey: inputs.value
    }
  }).then((res) => {
    render(res.data.data)
  })
}